<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-4.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">

<head>
    <title>订单弹屏</title>
    <th:block th:replace="common/common :: jscss"/><link rel="stylesheet" href="/static/style/call/zmn.order.call.pop.css">
</head>
<body>
    <div class="layui-card call-pop-page">
        <div class="container">
                <div class="layui-card-body">
                    <div class="layui-row">
                        <blockquote class="layui-elem-quote layui-text">
                            <th:block th:switch="${vo.type}">
                                <span th:case="1">工程师来电</span>
                                <span th:case="2">114老用户来电</span>
                                <span th:case="3">非114用户来电</span>
                            </th:block>
                            <div class="layui-btn-container">

                                <a class="layui-btn" th:if="${vo.type == 2}" th:href="|http://route-114.xiujiadian.com/cspagent/check?agent=cq&tel=${vo.phone}&area=500000&token=123456|" target="_blank">114渠道录单</a>
                                <a class="layui-btn" th:unless="${vo.type == 2}" th:href="|/order/normal/add.action?channelId=${#strings.defaultString(vo.channelId, '')}&telephone=${vo.phone}&cityId=${vo.cityId}|" target="_blank">新系统录单</a>
                                <a class="layui-btn layui-btn-primary" target="_blank" href="/">返回：运营平台 <i class="layui-icon">&#xe602;</i></a>
                            </div>
                        </blockquote>
                    </div>
                    <div class="layui-row">
                        <div class="layui-col-md12 info-container">
                            <div class="layui-row layui-col-md12 header">
                                <th:block th:switch="${vo.type}">
                                    <h2 th:case="1" th:text="|工程师来电，城市：${vo.cityName}，姓名：${vo.masterName}，电话：${vo.phone}|"></h2>
                                    <h2 th:case="2" th:text="|114用户来电，电话：${vo.phone}|"></h2>
                                    <h2 th:case="3" th:text="|用户来电，电话：${vo.phone}|"></h2>
                                </th:block>
                                <p class="subtitle" th:text="|来电时间：${#dates.format(vo.callTime, 'MM-dd HH:mm:ss')}|"></p>
                                <p class="important-note" th:if="${vo.type == 2}">我们是专业电器维修中心，不是售后，根据故障大小收费。为电信114用户，请咨询用户是否有：清洗优惠券</p>
                            </div>
                            <!-- 工单记录 -->
                            <div class="layui-row layui-col-md12 wrapper-table">
                                <th:block th:with="text = ${vo.type == 1 ? '工程师未完成工单' : '工单数量'}">
                                    <p class="count" th:text="|${text}：${#lists.size(vo.orderWorkList)}|"></p>
                                </th:block>

                                <table class="layui-table" lay-filter="workList">
                                    <thead>
                                        <tr>
                                            <th lay-data="{field:'operate', width:80, toolbar: '', align: 'center'}">操作</th>
                                            <th lay-data="{field:'warning', width:100}">警示</th>
                                            <th lay-data="{field:'receiveTime', width:100}">下单时间</th>
                                            <th lay-data="{field:'totalAmount', width:100}">订单收入</th>
                                            <th lay-data="{field:'currentRemark', width:100}">备注跟单</th>
                                            <th lay-data="{field:'userInfo', width:200}">用户信息</th>
                                            <th lay-data="{field:'address', width:100}">地址</th>
                                            <th lay-data="{field:'productInfo', width:100}">产品信息</th>
                                            <th lay-data="{field:'faultContent'}">故障现象</th>
                                            <th lay-data="{field:'statusName', width:100}">工单状态</th>
                                            <th lay-data="{field:'resultStatusName', width:100}">工单结果</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr th:each="e : ${vo.orderWorkList}">
                                            <td>
                                                <a class="layui-btn layui-btn-sm" target="_blank" th:href="|/customerservice/work/list.action?id=${e.workId}|">操作</a>
                                            </td>
                                            <td></td>
                                            <td th:text="${#dates.format(e.receiveTime, 'yyyy-MM-dd HH:mm:ss')}"></td>
                                            <td th:text="${#moneyUtil.parseToYuanStr(e.totalAmount)}"></td>
                                            <td th:text="${e.currentRemark}"></td>
                                            <td th:text="|${e.username} : ${e.userPhone}|"></td>
                                            <td th:text="|${e.countyName} ${e.userStreet} ${e.userAddress}|"></td>
                                            <td th:text="${e.productInfo}"></td>
                                            <td th:text="${e.faultContent}"></td>
                                            <td th:text="${e.statusName}"></td>
                                            <td th:text="${e.resultStatusName}"></td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                            <!-- 通话记录 -->
                            <div class="layui-row layui-col-md12 wrapper-table">
                                <th:block th:with="text = ${vo.type == 1 ? '最近3天通话记录' : '通话记录'}">
                                    <p class="count" th:text="|${text}：${#lists.size(vo.callRecordList)}|"></p>
                                </th:block>

                                <table class="layui-table" lay-filter="call">
                                    <thead>
                                    <tr>
                                        <th lay-data="{field:'callTime', width:100}">来电时间</th>
                                        <th lay-data="{field:'phone', width:100}">用户电话</th>
                                        <th lay-data="{field:'cityName', width:100}">城市</th>
                                        <th lay-data="{field:'callInOut', width:100}">呼入呼出</th>
                                        <th lay-data="{field:'operator', width:100}">话务员</th>
                                        <th lay-data="{field:'channelName', width:100}">来源</th>
                                        <th lay-data="{field:'callType', width:100}">通话类型</th>
                                        <th lay-data="{field:'sound'}">录音</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    <tr th:esle th:each="call : ${vo.callRecordList}">
                                        <td th:text="${call.callTime}"></td>
                                        <td th:text="${call.phone}"></td>
                                        <td th:text="${call.cityName}"></td>
                                        <td th:text="${call.callInOut}"></td>
                                        <td th:text="${call.operator}"></td>
                                        <td th:text="${call.channelName}"></td>
                                        <td th:text="${call.callType}"></td>
                                        <td>
                                            <audio th:if="${call.soundSrc != null and call.soundSrc ne ''}" class='audio' style='width:300px; height: 40px' th:src="${call.soundSrc}"  preload='meta' controls>	</audio>
                                        </td>
                                    </tr>
                                    </tbody>
                                </table>
                            </div>
                            <!-- 投诉记录 -->
                            <div class="layui-row layui-col-md12 wrapper-table" th:unless="${vo.type == 1}">
                                <p class="count" th:text="|工单投诉：${#lists.size(vo.orderWorkList)}|"></p>

                                <table class="layui-table" lay-filter="complait">
                                    <thead>
                                    <tr>
                                        <th lay-data="{field:'operate', width:80, toolbar: '', align: 'center'}">操作</th>
                                        <th lay-data="{field:'warning', width:100}">超时</th>
                                        <th lay-data="{field:'receiveTime', width:150}">投诉时间</th>
                                        <th lay-data="{field:'totalAmount', width:80}">投诉次数</th>
                                        <th lay-data="{field:'currentRemark'}">投诉内容</th>
                                        <th lay-data="{field:'level', width:80}">投诉等级</th>
                                        <th lay-data="{field:'userInfo', width:150}">用户信息</th>
                                        <th lay-data="{field:'cityName', width:100}">城市</th>
                                        <th lay-data="{field:'statusName', width:100}">状态</th>
                                        <th lay-data="{field:'channelName', width:100}">来源</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    <tr th:each="com : ${vo.complaintList}">
                                        <td>
                                            <a class="layui-btn layui-btn-sm"
                                               th:href="|${session['BFM-COMPLAIN'].value}/track/complain/list.action?complainId=${com.complainId}|"
                                               target="_blank"
                                               lay-event="operate">操作</a>
                                        </td>
                                        <td>
                                            <span class="layui-badge"
                                                  th:if="${com.timeOutStr != null}"
                                                  th:text="|${com.timeOutStr}|">
                                            </span>
                                        </td>
                                        <td th:text="${com.complainTime}"></td>
                                        <td th:text="${com.complainCount}"></td>
                                        <td th:text="${com.content}"></td>
                                        <td>
                                            <th:block  th:switch="${com.level}">
                                                <span th:case="1" class="layui-badge layui-bg-cyan"
                                                      th:text="${com.levelName}"></span>
                                                <span th:case="2" class="layui-badge layui-bg-blue"
                                                      th:text="${com.levelName}"></span>
                                                <span th:case="3" class="layui-badge layui-bg-orange"
                                                      th:text="${com.levelName}"></span>
                                                <span th:case="4" class="layui-badge layui-bg-red"
                                                      th:text="${com.levelName}"></span>
                                            </th:block>
                                        </td>
                                        <td th:text="|${com.realname}：${com.phone}|"></td>
                                        <td th:text="|${com.cityName}|"></td>
                                        <td th:text="${com.statusName}"></td>
                                        <td th:text="${com.channelName}"></td>
                                    </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
    </div>

    <!-- layui 模板 -->
    <script type="text/html" id="btn-operator">
        <a class="layui-btn layui-btn-sm" lay-event="operate">操作</a>
    </script>

    <script type="text/javascript" th:inline="javascript">
        var popVO = [[${vo}]];
        layui.config({
            base: "/static/js/module/"
        }).extend({
            oms_call_pop: "call/zmn.call.pop"
        }).use(['index', 'oms_call_pop']);
    </script>
</body>
</html>